<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="keywords" content="">
	<meta name="author" content="">
	<meta name="robots" content="">
	<meta name="viewport" content="width=device-width, initial-scale=1">

	<!-- PAGE TITLE HERE -->
	<title>发布职位</title>

	<link href="/css/nice-select.css" rel="stylesheet">
	<link href="/css/jquery.dataTables.min.css" rel="stylesheet">
	<link href="/css/bootstrap-datepicker.min.css" rel="stylesheet">

	<!-- Style css -->
    <link href="/css/style.css" rel="stylesheet">

</head>
<body>
<div class="container-fluid">
	<div class="d-flex align-items-center mb-4 mt-4">
		<h4 class="fs-20 font-w600 mb-0 me-auto">发布职位</h4>
		<div>
			<a href="javascript:void(0);" class="btn btn-secondary btn-sm me-3"> <i class="fas fa-envelope"></i></a>
			<a href="javascript:void(0);" class="btn btn-secondary btn-sm me-3"><i class="fas fa-phone-alt"></i></a>
			<a href="javascript:void(0);" class="btn btn-primary btn-sm"><i class="fas fa-info"></i></a>

		</div>
	</div>
	<div class="row">
		<div class="col-xl-12">
			<div class="card">
				<div class="card-body">
					<form id="jobForm">
						<div class="row">
							<!-- 职位标题 -->
							<div class="col-xl-6 col-md-6 mb-4">
								<label class="form-label font-w600 required-star">职位标题</label>
								<input type="text" class="form-control solid" name="title"
									   placeholder="例如：Java高级工程师" required>
								<div class="error-message" id="titleError"></div>
							</div>

							<!-- 职位类型 -->
							<div class="col-xl-6 col-md-6 mb-4">
								<label class="form-label font-w600 required-star">职位类型</label>
								<select class="form-select form-control solid" name="jobType" required>
									<option value="">请选择职位类型</option>
									<option value="全职">全职</option>
									<option value="兼职">兼职</option>
									<option value="实习">实习</option>
									<option value="合同制">合同制</option>
								</select>
								<div class="error-message" id="jobTypeError"></div>
							</div>

							<!-- 薪资范围 -->
							<div class="col-xl-6 col-md-6 mb-4">
								<label class="form-label font-w600 required-star">薪资范围</label>
								<input type="text" class="form-control solid" name="salaryRange"
									   placeholder="例如：15K-25K" required>
								<div class="error-message" id="salaryRangeError"></div>
							</div>

							<!-- 工作地点 -->
							<div class="col-xl-6 col-md-6 mb-4">
								<label class="form-label font-w600 required-star">工作地点</label>
								<input type="text" class="form-control solid" name="location"
									   placeholder="例如：北京市海淀区" required>
								<div class="error-message" id="locationError"></div>
							</div>

							<!-- 学历要求 -->
							<div class="col-xl-6 col-md-6 mb-4">
								<label class="form-label font-w600 required-star">学历要求</label>
								<select class="form-select form-control solid" name="education" required>
									<option value="">请选择学历要求</option>
									<option value="不限">不限</option>
									<option value="大专">大专</option>
									<option value="本科">本科</option>
									<option value="硕士">硕士</option>
									<option value="博士">博士</option>
								</select>
								<div class="error-message" id="educationError"></div>
							</div>

							<!-- 招聘人数 -->
							<div class="col-xl-6 col-md-6 mb-4">
								<label class="form-label font-w600">招聘人数</label>
								<input type="text" class="form-control solid" name="count"
									   placeholder="例如：5">
							</div>

							<!-- 过期时间 -->
							<div class="col-xl-6 col-md-6 mb-4">
								<label class="form-label font-w600 required-star">截止日期</label>
								<div class="input-group">
									<div class="input-group-text"><i class="far fa-clock"></i></div>
									<input type="text" class="form-control datepicker solid"
										   name="expirationTime" required readonly>
								</div>
								<div class="error-message" id="expirationTimeError"></div>
							</div>

							<!-- 职位描述 -->
							<div class="col-xl-12 mb-4">
								<label class="form-label font-w600 required-star">职位描述</label>
								<textarea class="form-control solid" name="description"
										  rows="6" placeholder="详细描述职位职责和要求..." required></textarea>
								<div class="error-message" id="descriptionError"></div>
							</div>

							<!-- 职位状态 -->
							<div class="col-xl-12 mb-4">
								<label class="form-label font-w600 required-star">职位状态</label>
								<div>
                                    <span class="me-4">
                                        <label class="radio-inline">
                                            <input type="radio" name="status" value="1" checked> 启用
                                        </label>
                                    </span>
									<span>
                                        <label class="radio-inline">
                                            <input type="radio" name="status" value="0"> 禁用
                                        </label>
                                    </span>
								</div>
							</div>
						</div>

						<div class="card-footer text-end">
							<button type="button" class="btn btn-light me-3" onclick="window.history.back()">取消</button>
							<button type="submit" class="btn btn-primary">发布职位</button>
						</div>
					</form>
				</div>
			</div>
		</div>
	</div>
</div>
<!-- 在 jQuery 之前引入 SweetAlert2 -->
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <!--**********************************
        Scripts
    ***********************************-->
    <!-- Required vendors -->
    <script src="/js/global.min.js"></script>
	<script src="/js/Chart.bundle.min.js"></script>
	<script src="/js/jquery.nice-select.min.js"></script>



	<!-- <script src="./vendor/popper/popper.min.js"></script>
	<script src="./vendor/bootstrap/js/bootstrap.bundle.min.js"></script> -->

	<!-- Chart piety plugin files -->
   <script src="/js/jquery.dataTables.min.js"></script>
   <script src="/js/datatables.init.js"></script>
   <script src="/js/bootstrap-datepicker.min.js"></script>

<script src="/js/custom.min.js"></script>
<script src="/js/dlabnav-init.js"></script>
<script src="/js/demo.js"></script>


<script>
	$(document).ready(function() {
		// 初始化日期选择器
		$('.datepicker').datepicker({
			format: 'yyyy-mm-dd',
			autoclose: true,
			todayHighlight: true,
			language: 'zh-CN',
			startDate: new Date()
		});

		// 设置默认日期为7天后
		let defaultDate = new Date();
		defaultDate.setDate(defaultDate.getDate() + 7);
		$('.datepicker').datepicker('setDate', defaultDate);

		// 表单提交处理
		$('#jobForm').on('submit', function(e) {
			e.preventDefault();

			// 清除之前的错误信息
			$('.error-message').hide();

			// 表单验证
			let isValid = true;
			$('#jobForm [required]').each(function() {
				if (!$(this).val()) {
					isValid = false;
					const fieldName = $(this).attr('name');
					$(`#${fieldName}Error`).text('此字段为必填项').show();
				}
			});

			if (!isValid) {
				Swal.fire({
					icon: 'error',
					title: '表单验证失败',
					text: '请填写所有必填字段'
				});
				return;
			}

			// 收集表单数据
			const formData = {
				title: $('input[name="title"]').val(),
				jobType: $('select[name="jobType"]').val(),
				salaryRange: $('input[name="salaryRange"]').val(),
				location: $('input[name="location"]').val(),
				education: $('select[name="education"]').val(),
				count: $('input[name="count"]').val(),
				// 添加时间部分使其符合LocalDateTime格式
				expirationTime: $('input[name="expirationTime"]').val() + "T00:00:00",
				description: $('textarea[name="description"]').val(),
				status: $('input[name="status"]:checked').val()
			};

			// 发送AJAX请求
			$.ajax({
				url: '/api/job/add',
				type: 'POST',
				contentType: 'application/json',
				data: JSON.stringify(formData),
				success: function(response) {
					Swal.fire({
						icon: 'success',
						title: '发布成功',
						text: '职位信息已成功发布',
						showConfirmButton: false,
						timer: 2000
					}).then(() => {
						window.location.href = '/user/job-list';
					});
				},
				error: function(xhr) {
					let errorMsg = '发布失败，请稍后再试';
					if (xhr.responseJSON && xhr.responseJSON.message) {
						errorMsg = xhr.responseJSON.message;
					}
					Swal.fire({
						icon: 'error',
						title: '发布失败',
						text: errorMsg
					});
				}
			});
		});

		// 实时表单验证
		$('#jobForm [required]').on('blur', function() {
			if (!$(this).val()) {
				const fieldName = $(this).attr('name');
				$(`#${fieldName}Error`).text('此字段为必填项').show();
			} else {
				$(`#${fieldName}Error`).hide();
			}
		});
	});
</script>
</body>
</html>